import { useEffect, useState } from 'react'
import { useParams } from 'react-router-dom'
import { Datum, fetchProblemDetailAPI } from '@/apis/supportProbDetail'
// import { log } from 'console'

function useProbDetail() {
  const [isLoading, setLoading] = useState<boolean>(false)
  // 标题
//   const [headers, setHeaders] = useState<HeaderItem["caption"]>()
  // 图片
  const [detailData, setImgs] = useState<Datum>({})
  const params = useParams()
  const id = params.id
  // console.log(id);
  
  useEffect(() => {
    const getProbDetail = async () => {
      try {
        setLoading(true)
        const res = await fetchProblemDetailAPI({id})
        // console.log(res);
        // setHeaders(res.data.head[0].caption)
        setImgs(res.data.data[0])
        setLoading(false)
      } catch (error) {
        throw new Error('fetch ProbDetail error')
      }
    }
    getProbDetail()
  }, [id])
  // 暴露数据
  return {
    detailData, isLoading
  }
}

export { useProbDetail }
